<template>
  <div class="circle-dialog">
    <div class="text">
      {{info.desc}}
    </div>

    <img :src="info.photo">
  </div>
</template>
<script>
export default {
  name: "CircleDialog",
  props:['info']
}
</script>
<style scoped lang="scss">
.circle-dialog {
  width: 530px;
  height: 200px;
  padding: 15px 5px;
  overflow: auto;
  display: flex;
  .text{
    width: 50%;
    color: #fff;
    text-indent: 14px;
  }
  img{
    width: 50%;
    height: 100%;
    border-radius: 5px;
  }
  &::-webkit-scrollbar {
    width: 2px;
  }

  &::-webkit-scrollbar-thumb {
    border-radius: 3px;
    background: rgba(0, 198, 255, .3);
  }

  &::-webkit-scrollbar-track {
    border-radius: 3px;
    background: rgba(0, 24, 48, .3);
  }
}
</style>
